import React, { Component } from "react";

export default class XzButton extends Component {
  constructor() {
    super();
    console.log("------construction:组件被构建出来了---");
  }
  componentDidMount() {
    console.log("------componentDidMount:组件被挂载出来了---");
  }
  shouldComponentUpdate(props, newState) {
    console.log("------shouldComponentUpdate:组件应该更新吗?---");
    // return true;
    if (newState.count % 2 === 0) {
      return true; //应该渲染出此次的渲染
    } else {
      return false;
    }
  }
  componentDidUpdate() {
    console.log("------componentDidUpdate:组件完成更新---");
  }
  componentWillUnmount() {
    console.log("------componentWillUnmount:组件将被卸载---");
  }
  // 状态数据
  state = {
    count: 0,
  };
  doClick = () => {
    let count = this.state.count + 1;
    this.setState({ count });
  };
  render() {
    console.log("------render:组件正在渲染内容---");

    return (
      <div>
        <button onClick={this.doClick}>我的被点击了{this.state.count}次</button>
      </div>
    );
  }
}
